<template>
  <div class="over">
    <div class="over-cover">
      <h1 class="over-cover-tit">晓果智学AI评测报告</h1>
      <h2 class="over-cover-seg">
        {{
          `${info.subInfo.subName} - ${info.subInfo.editionName} - ${info.subInfo.gradeName}`
        }}
      </h2>
      <!-- 章节 -->
      <ul class="over-cover-chapter">
        <li
          v-for="(item, index) in handleChapetr(info.subInfo.chapterList)"
          :key="'chapter' + index"
        >
          {{ item }}
        </li>
      </ul>
      <!-- 章节 - end -->
      <div class="over-cover-timeAndName">
        <p class="over-cover-name">
          学员姓名：<span>{{ info.userInfo.realName }}</span>
        </p>
        <p class="over-cover-time">
          报告日期：<span>{{ formatDate() }}</span>
        </p>
      </div>
    </div>
    <div class="over-result">
      <span class="over-result-word">测评结果</span>
      <span class="over-result-num">{{
        Math.round(
          getPointRate(
            info.data.rightNum,
            info.data.list ? info.data.list.length : 1
          )
        )
      }}</span>
    </div>
    <div class="over-analyse">
      <ul class="over-analyse-ul clear">
        <li class="over-analyse-li over-mr40">
          <p class="over-analyse-li-p">
            得分率：<span
              >{{
                getPointRate(
                  info.data.rightNum,
                  info.data.list ? info.data.list.length : 1
                )
              }}%</span
            >
          </p>
          <van-progress :percentage="50" stroke-width="8" :show-pivot="false" />
        </li>
        <li class="over-analyse-li">
          <p class="over-analyse-li-p">
            用时：<span>{{ getMS(info.useTime) }}</span>
          </p>
          <van-progress
            :percentage="123 / 18"
            stroke-width="8"
            :show-pivot="false"
          />
        </li>
        <li class="over-analyse-li over-mr40">
          <p class="over-analyse-li-p">平均得分率：<span>70%</span></p>
          <van-progress :percentage="70" stroke-width="8" :show-pivot="false" />
        </li>
        <li class="over-analyse-li">
          <p class="over-analyse-li-p">
            平均用时：<span>{{ getMS(1296) }}</span>
          </p>
          <van-progress :percentage="72" stroke-width="8" :show-pivot="false" />
        </li>
      </ul>
      <div class="over-analyse-test">
        <div
          class="over-analyse-test-inner"
          :style="`color:${gradeColor[reportGrade]}`"
        >
          <span class="over-analyse-test-inner-grade">{{ reportGrade }}</span>
          <p class="over-analyse-test-inner-word">等级评定</p>
        </div>
      </div>
      <p class="over-analyse-rule">
        *根据教育部《关于普通高中学业水平考试的实施意见》(教基二[2014]10号)
        所给的标准，以等级呈现成绩，位次由高到低为A至E等级。其中A等级15%，B等级30%，C等级30%，D、E等级共25%，智能提分系统参照此文件，在义务教育阶段同等适用。
      </p>
    </div>

    <div class="over-know">
      <h1 class="over-know-tit">知识点掌握情况</h1>
      <div class="over-know-get over-know-common">
        <h3 class="over-know-common-tit">已掌握知识点</h3>
        <ul class="over-know-common-ul clear">
          <li
            class="over-know-common-li"
            v-for="(item, index) in info.data.acquireKnowledge"
            :key="'acquire' + index"
          >
            {{ item.name }}
          </li>
        </ul>
      </div>
      <div class="over-know-unGet over-know-common">
        <h3 class="over-know-common-tit">未掌握知识点</h3>
        <ul class="over-know-common-ul clear">
          <li
            class="over-know-common-li"
            v-for="(item, index) in info.data.lackOfKnowledge"
            :key="'lackOf' + index"
          >
            {{ item.name }}
          </li>
        </ul>
      </div>
      <div class="over-know-extend over-know-common">
        <h3 class="over-know-common-tit">未做题智能判断未掌握知识点</h3>
        <ul class="over-know-common-ul clear">
          <li
            class="over-know-common-li"
            v-for="(item, index) in info.data.guessAcquireKnowledge"
            :key="'guessAcquire' + index"
          >
            {{ item.name }}
          </li>
        </ul>
      </div>
    </div>
    <div class="over-questionList">
      <div class="over-questionList-tit">答题情况</div>

      <div class="over-questionList-box" id="renderQuestion">
        <div
          class="over-questionList-item"
          v-for="(item, index) in info.data.list"
          :key="'question' + index"
        >
          <div class="over-questionList-question">
            <!-- 题目 -->
            <div class="over-questionList-question-tit">
              <span v-html="item.title"></span>
            </div>
            <!-- 答案 -->
            <ul class="over-questionList-question-answer">
              <li
                v-for="(answerItem, answerIndex) in item.answer"
                :class="answerRight(answerItem, item.studentAnswer)"
                :key="'answer' + answerIndex"
              >
                <div
                  class="over-questionList-question-left"
                  v-html="treABCD[answerIndex]"
                ></div>
                <div
                  class="over-questionList-question-right"
                  v-html="answerItem.answer"
                ></div>
              </li>
            </ul>
          </div>
          <!-- 答案/解析 -->
          <div class="over-questionList-parse">
            <h3 class="over-questionList-parse-tit">答案解析</h3>
            <div class="over-questionList-parse-content">
              <h2>【答案】</h2>
              <p class="over-pl20">{{ handleAnswerFil(item.answer) }}</p>
              <h2>【解析】</h2>
              <p v-html="item.parse"></p>
            </div>
          </div>
        </div>

      </div>
    </div>
    <div class="over-share">
      <ul class="over-share-ul">
        <li>
          <div class="over-share-common-left">
            {{ this.param.campusId ? "校区名称：" : "机构名称：" }}
          </div>
          <div class="over-share-common-right">{{ info.userInfo.title }}</div>
        </li>
        <li>
          <div class="over-share-common-left">
            {{ this.param.campusId ? "校区电话：" : "机构电话：" }}
          </div>
          <div class="over-share-common-right">
            {{ info.userInfo.servicePhone }}
          </div>
        </li>
        <li>
          <div class="over-share-common-left">
            {{ this.param.campusId ? "校区地址：" : "机构地址：" }}
          </div>
          <div class="over-share-common-right">{{ info.userInfo.address }}</div>
        </li>
        <li>
          <div class="over-share-common-left over-share-common-left-code">
            评测二维码：
          </div>
          <div class="over-share-common-right">
            <img :src="img" width="160px" />
          </div>
        </li>
      </ul>
    </div>
  </div>
</template>
<script>
import { getInviteInfo } from "@/server/api.js";
import renderMathInElement from "katex/dist/contrib/auto-render.js";

import { mapGetters } from "vuex";
import { formatDate } from "@/utils/utils";
import img from "@/assets/image/weS.jpg";
export default {
  name: "over",
  components: {},
  data() {
    return {
      reportGrade: "A",
      img,
      treABCD: {
        0: "A",
        1: "B",
        2: "C",
        3: "D",
        4: "E",
        5: "F",
        6: "G",
        7: "H",
        8: "G"
      },
      gradeColor: {
        A: "#4CEA98",
        B: "#FBDD74",
        C: "#F8A637",
        D: "#3FB6FC",
        E: "#F66D43"
      },
      userInfo: {},
      url: "https://www.xiaoguoai.cn/",
      data: {
        acquireKnowledge: [
          { id: 1000616, name: "电解水实验", children: null },
          { id: 1000173, name: "物体的浮沉条件及其应用", children: null },
          { id: 1000170, name: "浮力大小的计算", children: null },
          { id: 1000556, name: "过滤的原理、方法及其应用", children: null },
          {
            id: 1000641,
            name: "物质的溶解性及影响溶解性的因素",
            children: null
          },
          { id: 1000624, name: "水资源的污染与防治", children: null }
        ],
        guessAcquireKnowledge: [
          { id: 1000168, name: "浮力产生的原因", children: null },
          { id: 1000169, name: "阿基米德原理", children: null },
          { id: 1000623, name: "水资源状况", children: null }
        ],
        generalKnowledge: [],
        guessGeneralKnowledge: null,
        lackOfKnowledge: [
          { id: 1000640, name: "晶体和结晶的概念与现象", children: null },
          { id: 1000554, name: "一定溶质质量分数的溶液的配制", children: null },
          { id: 1000169, name: "阿基米德原理", children: null }
        ],
        guessLackOfKnowledge: [
          { id: 1000170, name: "浮力大小的计算", children: null },
          { id: 1000557, name: "结晶的原理、方法及其应用", children: null }
        ],
        list: [
          {
            questionId: 1181678,
            setId: null,
            title:
              "t℃时，某物质的溶液220g，蒸发去15g水后，析出晶体6g，又蒸发去10g水，析出6g晶体，再蒸去25g水又析出晶体的质量为(　　)",
            typeId: 1,
            source: "",
            year: 0,
            difficulty: 3,
            useTime: 1,
            isTrue: 0,
            parse:
              "【分析】蒸发去15g水后，析出晶体6g，剩余溶液变成饱和溶液，又蒸发去10g水，析出6g晶体，说明该温度下10g水中溶解6g该物质恰好饱和．",
            knowledgeId: 1000640,
            knowledgeName: "晶体和结晶的概念与现象",
            isModify: 0,
            isFine: 0,
            answer: [
              { answerId: 1725423, answer: "6g", isTrue: 0, order: 1 },
              { answerId: 1725424, answer: "12g", isTrue: 0, order: 2 },
              { answerId: 1725425, answer: "15g", isTrue: 1, order: 3 },
              { answerId: 1725426, answer: "无法计算", isTrue: 0, order: 4 }
            ],
            studentAnswer: [
              { answerId: 1725423, answer: null, isTrue: 0, order: 1 }
            ]
          },
          {
            questionId: 1195067,
            setId: null,
            title: "下列关于电解水实验及有关物质说法错误的是(　　)",
            typeId: 1,
            source: "2014秋•承德校级期末",
            year: 2014,
            difficulty: 4,
            useTime: 1,
            isTrue: 1,
            parse:
              "【分析】A、水中加入稀硫酸用来增加导电性；<br />B、电解水的试验中正极产生氧气，负极产生氢气；<br />C、氢气不易溶于水；<br />D、氢气是最轻的气体．",
            knowledgeId: 1000616,
            knowledgeName: "电解水实验",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 1778978,
                answer: "水中加入稀硫酸用来增加导电性",
                isTrue: 0,
                order: 1
              },
              {
                answerId: 1778979,
                answer: "正极产生氢气，负极产生氧气",
                isTrue: 1,
                order: 2
              },
              {
                answerId: 1778980,
                answer: "用排水法收集氢气",
                isTrue: 0,
                order: 3
              },
              {
                answerId: 1778981,
                answer: "氢气密度比空气的密度小",
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 1778979, answer: null, isTrue: 1, order: 1 }
            ]
          },
          {
            questionId: 1641288,
            setId: null,
            title:
              "将一小石块和小木块抛入一杯水中，结果发现木块浮在水面上，而石块却沉入水中．就此现象，下列分析正确的是( )<br>",
            typeId: 1,
            source: "《第14章 压强和压力》2007年单元测试卷（1）（解析版）",
            year: 2007,
            difficulty: 3,
            useTime: 1,
            isTrue: 1,
            parse:
              "<p><br>A、水中的石块和木块都受到浮力作用，不符合题意；<br>B、石块沉入水中，所受浮力小于自身的重力，符合题意；<br>C、木块受到的浮力可能等于或小于石块所受的浮力，不符合题意；<br>D、木块浮在水面上，所受浮力等于自身的重力，不符合题意；<br>故选B．<br>",
            knowledgeId: 1000173,
            knowledgeName: "物体的浮沉条件及其应用",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 3562899,
                answer: "木块受到浮力，石块不受浮力<br>",
                isTrue: 0,
                order: 1
              },
              {
                answerId: 3562900,
                answer: "石块沉入水中，所受浮力小于自身的重力<br>",
                isTrue: 1,
                order: 2
              },
              {
                answerId: 3562901,
                answer: "木块受到的浮力一定大于石块所受的浮力<br>",
                isTrue: 0,
                order: 3
              },
              {
                answerId: 3562902,
                answer: "木块浮在水面上，所受浮力大于自身的重力<br>",
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 3562900, answer: null, isTrue: 1, order: 1 }
            ]
          },
          {
            questionId: 1846808,
            setId: null,
            title:
              '<img  src="/tikuimages/8/2016/400/xuekubao31/e77b3dde-947c-11e9-9db3-b42e9921e93e_xkb82.png" style="vertical-align:middle;FLOAT:right" />如图甲所示，长方体金属块在细绳竖直向上拉力F作用下，从水中竖直向上做匀速直线运动，上升到离开水面一定高度处．图乙是绳子拉力F随时间t变化的图象，取g=10N/Kg．根据图象信息，下列判断正确的是(　　)',
            typeId: 1,
            source: "2016春•武侯区期末",
            year: 2016,
            difficulty: 3,
            useTime: 1,
            isTrue: 1,
            parse:
              "【分析】分析绳子拉力随时间t变化的图象，当金属块从水中一直竖直向上做匀速直线运动，但未露出液面，此时金属块排开水的体积不变，由阿基米德原理可知，此时的浮力不变，绳子的拉力也不变，即为图中的AB段．<br />当金属块完全露出液面，没有浸入水中时，金属块不受浮力，此时拉力等于重力，即为图中的CD段，据此求出金属块重．来判断C是否符合题意．<br />当金属块未露出液面时，拉力等于重力减去浮力，据此求金属块受到的浮力，据此来判断A是否符合题意．<br />首先判断拉力的在t<SUB>1</SUB>至t<SUB>2</SUB>时间段内(即BC段)的变化，再利用公式F<SUB>浮</SUB>=G-F<SUB>拉</SUB>判断浮力的变化．来判断BD是否符合题意．",
            knowledgeId: 1000170,
            knowledgeName: "浮力大小的计算",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 4384581,
                answer: "浸没在水中的金属块受到的浮力大小是20N",
                isTrue: 1,
                order: 1
              },
              {
                answerId: 4384582,
                answer: "乙图中BC段图线说明金属块在水中受到的浮力慢慢增大",
                isTrue: 0,
                order: 2
              },
              {
                answerId: 4384583,
                answer: "该金属块重力的大小为34N",
                isTrue: 0,
                order: 3
              },
              {
                answerId: 4384584,
                answer:
                  "在t<SUB>1</SUB>至t<SUB>2</SUB>时间段金属块在水中受到的浮力逐渐减小",
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 4384581, answer: null, isTrue: 1, order: 1 }
            ]
          },
          {
            questionId: 1849001,
            setId: null,
            title: "下列实验中的做法错误的是(　　)",
            typeId: 1,
            source: "2015秋•川汇区校级月考",
            year: 2015,
            difficulty: 3,
            useTime: 1,
            isTrue: 1,
            parse:
              "【分析】A、根据用红磷燃烧测定空气中氧气的含量，要将氧气尽可能的消耗完全，进行分析判断．<br />B、根据铁丝在氧气中燃烧的实验注意事项，进行分析判断．<br />C、根据排水法收集气体的注意事项进行分析判断．<br />D、根据过滤时的注意事项进行分析判断．",
            knowledgeId: 1000556,
            knowledgeName: "过滤的原理、方法及其应用",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 4393343,
                answer: "用红磷燃烧测定空气中氧气的含量时，用足量的红磷",
                isTrue: 0,
                order: 1
              },
              {
                answerId: 4393344,
                answer: "做铁丝在氧气中燃烧实验前，在集气瓶内铺一层细沙",
                isTrue: 0,
                order: 2
              },
              {
                answerId: 4393345,
                answer: "排水法收集气体，当导管口刚有气泡冒出时立即收集",
                isTrue: 1,
                order: 3
              },
              {
                answerId: 4393346,
                answer:
                  "过滤操作中，过滤时漏斗末端管口应紧靠烧杯内壁，漏斗液面应低于滤纸边缘",
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 4393345, answer: null, isTrue: 1, order: 1 }
            ]
          },
          {
            questionId: 1880905,
            setId: null,
            title: "下列排列顺序正确的是(　　)",
            typeId: 1,
            source: "2016秋•镇江期末",
            year: 2016,
            difficulty: 3,
            useTime: 1,
            isTrue: 1,
            parse:
              "【分析】根据已有的物质的成分、元素的化合价、物质的溶解度以及金属的性质进行分析解答即可．",
            knowledgeId: 1000641,
            knowledgeName: "物质的溶解性及影响溶解性的因素",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 4520923,
                answer:
                  '碳元素的含量：<span dealflag="1" class="MathJye" mathtag="math" style="whiteSpace:nowrap;wordSpacing:normal;wordWrap:normal"><table cellpadding="-1" cellspacing="-1" style="margin-right:1px"><tr><td style="font-size:90%;">生铁钢金刚石</td></tr><tr><td><div hassize="9"><div style="background: url(\'/upimages/images/formula/part/8594L.png\') repeat-x; width:1px; height:5px;float:left;overflow:hidden" muststretch="h"></div><div style="background: url(\'/upimages/images/formula/part/8594.png\') no-repeat; width:9px; height:5px;float:left;overflow:hidden"></div></div></td></tr><tr><td style="font-size:90%">由低到高</td></tr></table></span>',
                isTrue: 0,
                order: 1
              },
              {
                answerId: 4520924,
                answer:
                  '氯元素化合价：<span dealflag="1" class="MathJye" mathtag="math" style="whiteSpace:nowrap;wordSpacing:normal;wordWrap:normal"><table cellpadding="-1" cellspacing="-1" style="margin-right:1px"><tr><td style="font-size:90%;">NaClC<span><span>l</span><span style="vertical-align:sub;font-size:90%">2</span></span>KCl<span><span>O</span><span style="vertical-align:sub;font-size:90%">3</span></span></td></tr><tr><td><div hassize="9"><div style="background: url(\'/upimages/images/formula/part/8594L.png\') repeat-x; width:1px; height:5px;float:left;overflow:hidden" muststretch="h"></div><div style="background: url(\'/upimages/images/formula/part/8594.png\') no-repeat; width:9px; height:5px;float:left;overflow:hidden"></div></div></td></tr><tr><td style="font-size:90%">由低到高</td></tr></table></span>',
                isTrue: 1,
                order: 2
              },
              {
                answerId: 4520925,
                answer:
                  '20℃在水中溶解度：<span dealflag="1" class="MathJye" mathtag="math" style="whiteSpace:nowrap;wordSpacing:normal;wordWrap:normal"><table cellpadding="-1" cellspacing="-1" style="margin-right:1px"><tr><td style="font-size:90%;">Ca(OH<span><span>)</span><span style="vertical-align:sub;font-size:90%">2</span></span>CaC<span><span>l</span><span style="vertical-align:sub;font-size:90%">2</span></span>CaC<span><span>O</span><span style="vertical-align:sub;font-size:90%">3</span></span></td></tr><tr><td><div hassize="9"><div style="background: url(\'/upimages/images/formula/part/8594L.png\') repeat-x; width:1px; height:5px;float:left;overflow:hidden" muststretch="h"></div><div style="background: url(\'/upimages/images/formula/part/8594.png\') no-repeat; width:9px; height:5px;float:left;overflow:hidden"></div></div></td></tr><tr><td style="font-size:90%">由小到大</td></tr></table></span>',
                isTrue: 0,
                order: 3
              },
              {
                answerId: 4520926,
                answer:
                  '金属的耐腐蚀性：<span dealflag="1" class="MathJye" mathtag="math" style="whiteSpace:nowrap;wordSpacing:normal;wordWrap:normal"><table cellpadding="-1" cellspacing="-1" style="margin-right:1px"><tr><td style="font-size:90%;">AlFeCu</td></tr><tr><td><div hassize="9"><div style="background: url(\'/upimages/images/formula/part/8594L.png\') repeat-x; width:1px; height:5px;float:left;overflow:hidden" muststretch="h"></div><div style="background: url(\'/upimages/images/formula/part/8594.png\') no-repeat; width:9px; height:5px;float:left;overflow:hidden"></div></div></td></tr><tr><td style="font-size:90%">由弱到强</td></tr></table></span>',
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 4520924, answer: null, isTrue: 1, order: 1 }
            ]
          },
          {
            questionId: 1985388,
            setId: null,
            title:
              "取一片金属箔做成中空的桶，它可以漂浮在盛有水的烧杯中。如果将此金属箔揉成团，它会沉入水底。比较上述两种情况，则下列说法中正确的是()",
            typeId: 1,
            source:
              "2011-2012学年福建省永定侨育中学八年级下学期期中考试物理试卷（带解析）",
            year: 2012,
            difficulty: 3,
            useTime: 1,
            isTrue: 1,
            parse:
              '<div class="pt5"><em>【分析】</em>要解决此题，需要掌握物体的浮沉条件：<br/>完全浸没在液体中的物体．<br/>若受到浮力大于重力，则上浮，最后漂浮在液面上．<br/>若受到浮力等于重力，则悬浮．<br/>若受到浮力小于重力，则下沉到液底．<br/>同时要掌握浮力的计算公式：F<sub>浮</sub>=ρ<sub>液</sub>gV<sub>排</sub> ． </div><div class="pt6">【解答】题目中说的两种情况下，金属箔的多少没变，所以两种情况下的重力是相等的．所以A说法错误．<br/>因为金属箔做成中空的桶时，增大了排开水的体积，增大了浮力，浮力等于重力，所以物体漂浮在水面上．<br/>而将金属箔揉成团，它的体积减小，排开水的体积减少，所以受到的浮力减小，小于重力，因此它会沉入水底．所以CD说法错误，B说法正确．<br/>故选B．</div><div class="pt7"><em>【点评】</em>此题主要考查了物体浮沉条件中的空心问题，要知道物体做成空心的可以通过增大排开水的体积，来增大浮力．使物体能够漂浮在液面上．并且知道漂浮时，浮力等于重力；下沉时，浮力小于重力．</div>',
            knowledgeId: 1000173,
            knowledgeName: "物体的浮沉条件及其应用",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 4928780,
                answer: "金属箔漂浮时受到的重力比它沉底时受到的重力小",
                isTrue: 0,
                order: 1
              },
              {
                answerId: 4928781,
                answer: "金属箔漂浮时受到的浮力比它沉底时受到的浮力大",
                isTrue: 1,
                order: 2
              },
              {
                answerId: 4928782,
                answer: "金属箔沉底时排开水的体积比它漂浮时排开水的体积大",
                isTrue: 0,
                order: 3
              },
              {
                answerId: 4928783,
                answer: "金属箔沉底时受到的浮力等于它的重力",
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 4928781, answer: null, isTrue: 1, order: 1 }
            ]
          },
          {
            questionId: 2120404,
            setId: null,
            title:
              "<div> 质量分数为\\(\\rm{30\\%}\\)的某溶液蒸发掉\\(\\rm{10g}\\)水后，溶液的质量分数变为\\(\\rm{40\\%}\\)，则原溶液的质量是\\(\\rm{(}\\)　　\\(\\rm{)}\\) </div> ",
            typeId: 1,
            source:
              "新人教版九年级下册《第9单元 溶液》2018年单元测试卷（山东省菏泽市郓城县随官屯中学）",
            year: 2018,
            difficulty: 3,
            useTime: 1,
            isTrue: 0,
            parse:
              "<div> 解：设原溶液的质量是\\(\\rm{x}\\)，那么溶质的质量为\\(\\rm{30\\%x}\\)；由蒸发溶剂前后溶质的质量不变，则：蒸发溶剂水后溶质的质量分数\\(\\rm{= \\dfrac {30\\%x}{x-10g}&times;100\\%=40\\%}\\)，解得：\\(\\rm{x=40g}\\) <br />故选：\\(\\rm{B}\\)。 <br />根据题意要求“原溶液的质量”那么设原溶液的质量为\\(\\rm{xg}\\)；认真审题后又知，蒸发水的前后溶质的质量是不变的，则可以表示成\\(\\rm{30\\%x}\\)，溶液的质量变为\\(\\rm{x-10}\\)；那么根据溶质的质量分数\\(\\rm{= \\dfrac {{溶质的质量}}{{溶液的质量}}&times;100\\%}\\)，可以表示出新溶液的质量分数，从而解得\\(\\rm{x}\\)．<br />本题是一道关于溶液变化前后的有关简单的计算，属于基础性内容；解答此题是要抓住蒸发溶剂前后溶质的质量不变，只是溶液的质量发生改变，根据这个等量关系可以列出数学方程进行解答．</div>",
            knowledgeId: 1000554,
            knowledgeName: "一定溶质质量分数的溶液的配制",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 5476448,
                answer: "\\(\\rm{30g}\\)",
                isTrue: 0,
                order: 1
              },
              {
                answerId: 5476449,
                answer: "\\(\\rm{40g}\\)",
                isTrue: 1,
                order: 2
              },
              {
                answerId: 5476450,
                answer: "\\(\\rm{50g}\\)",
                isTrue: 0,
                order: 3
              },
              {
                answerId: 5476451,
                answer: "\\(\\rm{60g}\\)",
                isTrue: 0,
                order: 4
              }
            ],
            studentAnswer: [
              { answerId: 5476450, answer: null, isTrue: 0, order: 1 }
            ]
          },
          {
            questionId: 2138140,
            setId: null,
            title:
              '<div><img  src="/tikuimages/8/2018/400/xuekubao12/66dda7a1-93ef-11e9-b71e-b42e9921e93e_xkb55.png" style="vertical-align:middle;FLOAT:right" w="74px" h="61px" />一块冰浮于盐水中，如图那么当冰熔化前后，其液面将\\((\\)　　\\()\\) </div> ',
            typeId: 1,
            source: "2018年山东省德州市中考物理一模试卷",
            year: 2018,
            difficulty: 3,
            useTime: 1,
            isTrue: 0,
            parse:
              "<div> 解： <br />冰块漂浮在盐水中，所以，\\(F_{浮}=G_{冰}\\)， <br />由阿基米德原理和重力公式可得：\\(ρ_{盐水}gV_{排}=m_{冰}g\\)， <br />则：\\(V_{排}= \\dfrac {m_{{冰}}}{\\rho _{{盐水}}}\\)-----\\(①\\) <br />冰熔化成水之后，状态变化，质量不变，所以，\\(m_{冰化水}=m_{冰}\\)， <br />由\\(ρ= \\dfrac {m}{V}\\)可得，冰化为水的体积：\\(V_{冰化水}= \\dfrac {m_{{冰化水}}}{\\rho _{{水}}}= \\dfrac {m_{{冰}}}{\\rho _{{水}}}\\)------\\(②\\)， <br />已知\\(ρ_{盐水}  &gt;  ρ_{水}\\)，比较\\(①②\\)可知\\(V_{冰化水}  &gt;  V_{排}\\)， <br />由于容器没有盛满盐水，所以冰全部熔化后，盐水液面将上升。 <br />故选：\\(A\\)。 <br />\\((1)\\)冰漂浮在浓盐水中，利用漂浮条件和阿基米德原理求出冰块排开浓盐水的体积。根据\\(ρ= \\dfrac {m}{V}\\)求出当冰熔化之后水的体积。 <br />\\((2)\\)比较上面的两个体积，如果冰化成水的体积大于冰块排开浓盐水的体积，液面上升；如果冰化成水的体积等于冰块排开浓盐水的体积，液面不变；如果冰化成水的体积小于冰块排开浓盐水的体积，液面下降。 <br />本题考查了学生对质量是物体属性、密度公式、阿基米德原理、物体的漂浮条件的掌握和运用，根据冰化水质量不变和漂浮条件找出关系式\\(V_{排}  &lt;  V_{冰化水}\\)是本题的解题关键。 </div>",
            knowledgeId: 1000169,
            knowledgeName: "阿基米德原理",
            isModify: 0,
            isFine: 0,
            answer: [
              { answerId: 5547394, answer: "升高", isTrue: 1, order: 1 },
              { answerId: 5547395, answer: "降低", isTrue: 0, order: 2 },
              { answerId: 5547396, answer: "不变", isTrue: 0, order: 3 },
              { answerId: 5547397, answer: "无法判断", isTrue: 0, order: 4 }
            ],
            studentAnswer: [
              { answerId: 5547395, answer: null, isTrue: 0, order: 1 }
            ]
          },
          {
            questionId: 2235357,
            setId: null,
            title:
              '<p class="DefaultParagraph0">化学与生活、社会息息相关，下列说法不正确的是(&nbsp;&nbsp;&nbsp;&nbsp;)</p>',
            typeId: 1,
            source: "新余市渝水区2016-2017学年上学期初三期末检测(化学)",
            year: 2017,
            difficulty: 3,
            useTime: 1,
            isTrue: 1,
            parse:
              '<div><p>【分析】</p> <p>本题<span>主要考查空气、</span><span id="seclist"><span class="secname">水体污染和防治，爱护水资源，</span><span class="secname">食物安全和低碳生活</span></span><span>等考点的理解，难度不大。</span></p> <p>【解答】</p> <p><span>A.太阳能等清洁能源的利用能大大减少化石燃料的使用，减少有毒气体的排放、二氧化碳的排放，减少环境污染，故A正确，但不符合题意；</span><br /><span>B.</span>食品添加剂确实提高了现代食品的品质，副作用也是显而易见的，合理使用食品添加剂，对丰富食品生产和促进人体健康有好处，可以食用，但不能过量，故B错误，但符合题意；<br /><span>C.由于重金属是有毒能使蛋白质变性，而废旧电池中含有铅、镉、汞等重金属，废弃能污染土壤和水源，所以应积极开发废电池的综合利用技术，故C正确，但不符合题意；</span><br /><span>D.</span>塑料难以降解容易造成白色污染，提倡人们购物时不用塑料袋，防止白色污染，故D正确，但不符合题意。<br /><span>故选B。</span></p></div>',
            knowledgeId: 1000624,
            knowledgeName: "水资源的污染与防治",
            isModify: 0,
            isFine: 0,
            answer: [
              {
                answerId: 5934774,
                answer:
                  "利用太阳能等清洁能源代替化石燃料，有利于节约资源、保护环境",
                isTrue: 0,
                order: 1
              },
              {
                answerId: 5934775,
                answer: "凡含有食品添加剂的食物对人体健康均有害，不可食用",
                isTrue: 1,
                order: 2
              },
              {
                answerId: 5934776,
                answer:
                  "为防止电池中的重金属等污染土壤和水体，应积极开发废电池的综合利用技术",
                isTrue: 0,
                order: 3
              },
              {
                answerId: 5934777,
                answer:
                  '提倡人们购物时不用一次性塑料袋而多用布袋，符合“低碳生活”的理念 <table border="1" cellpadding="0" cellspacing="0" class="MsoNormalTable" style="" width="100%"> <tbody> <tr style="mso-yfti-irow:0;mso-yfti-firstrow:yes"> <td style="width:11.25pt;border:solid white 1.0pt;    mso-border-alt:solid white .25pt;padding:0cm 0cm 0cm 0cm" valign="top" width="15">',
                isTrue: 0,
                order: 4
              },
              {
                answerId: 5934778,
                answer:
                  ' <div id="cke_pastebin" style="position: absolute; top: 209px; width: 1px; height: 616px; overflow: hidden; left: -1000px;"> A.利用太阳能等清洁能源代替化石燃料，有利于节约资源、保护环境 </div> <div id="cke_pastebin" style="position: absolute; top: 209px; width: 1px; height: 616px; overflow: hidden; left: -1000px;"> B.凡含有食品添加剂的食物对人体健康均有害，不可食用 </div> <div id="cke_pastebin" style="position: absolute; top: 209px; width: 1px; height: 616px; overflow: hidden; left: -1000px;"> C.为防止电池中的重金属等污染土壤和水体，应积极开发废电池的综合利用技术 </div> <div id="cke_pastebin" style="position: absolute; top: 209px; width: 1px; height: 616px; overflow: hidden; left: -1000px;"> D.提倡人们购物时不用一次性塑料袋而多用布袋，符合“低碳生活”的理念 </div>',
                isTrue: 0,
                order: 5
              }
            ],
            studentAnswer: [
              { answerId: 5934775, answer: null, isTrue: 1, order: 1 }
            ]
          }
        ]
      }
    };
  },
  created() {
    if (!this.info.id) {
      // this.$router.push({
      //   path: "/home"
      // });
      return;
    }
    this.$nextTick(() => {
      this.renderDom();
    });
  },
  computed: {
    ...mapGetters(["question", "param", "info"])
  },
  mounted() {
    this.getReportGrade();
  },
  methods: {
    handleAnswerFil(answer) {
      let i = 0;
      answer.map((item, index) => {
        if (item.isTrue) {
          i = index;
        }
      });
      return this.treABCD[i];
    },
    handleChapetr(data) {
      if (data.length > 9) {
        data.splice(9);
        data.push("......");
      }
      return data;
    },
    getReportGrade() {
      let scoreGrade = Number(
        this.getPointRate(
          this.info.data.rightNum,
          this.info.data.list ? this.info.data.list.length : 1
        )
      );

      if (scoreGrade >= 0 && scoreGrade < 10) {
        this.reportGrade = "E";
      } else if (scoreGrade >= 10 && scoreGrade < 25) {
        this.reportGrade = "D";
      } else if (scoreGrade >= 25 && scoreGrade < 55) {
        this.reportGrade = "C";
      } else if (scoreGrade >= 55 && scoreGrade < 85) {
        this.reportGrade = "B";
      } else if (scoreGrade >= 85 && scoreGrade <= 100) {
        this.reportGrade = "A";
      } else {
        this.reportGrade = "A";
      }
    },
    getPointRate(num, all) {
      let curNum = num || 0;
      let curAll = all || 1;
      let str = ((curNum / curAll) * 100).toFixed(2);
      return str;
    },
    getMS(useTime) {
      let m = Math.floor(useTime / 60);
      let s = Math.floor(useTime % 60);
      let str = "";
      if (m > 0) {
        str += m + "分";
      }
      if (s > 0) {
        str += s + "秒";
      }
      return str;
    },
    formatDate() {
      return formatDate();
    },
    answerRight(answer, studentAnswer) {
      if (answer.isTrue) {
        return "right-select";
      }
      let btn = 0;
      studentAnswer.map(item => {
        if (item.answerId == answer.answerId) {
          if (item.isTrue) {
            btn = 1;
          } else {
            btn = 2;
          }
        }
      });
      if (btn == 1) {
        return "right-select";
      }
      if (btn == 2) {
        return "error-select";
      } else {
        return "";
      }
    },
    renderDom() {
      renderMathInElement(document.getElementById("renderQuestion"), {
        delimiters: [
          {
            left: "$$",
            right: "$$",
            display: true
          },
          {
            left: "\\[",
            right: "\\]",
            display: true
          },
          {
            left: "$",
            right: "$",
            display: false
          },
          {
            left: "\\(",
            right: "\\)",
            display: false
          }
        ]
      });
    }
  }
};
</script>
